<template>
    <van-tabbar v-model="active" route active-color="red">
        <van-tabbar-item replace to="/film" icon="fire">电影</van-tabbar-item>
        <van-tabbar-item replace to="/cinema" icon="friends">影院</van-tabbar-item>
        <van-tabbar-item replace to="/news" icon="diamond">咨询</van-tabbar-item>
        <van-tabbar-item replace to="/center" icon="manager" badge="5">我的</van-tabbar-item>
    </van-tabbar>
</template>
  
<script lang="ts" setup>
import { ref } from 'vue';
// 根据路由切换动态的设置 索引值  也可以设置 name
const active = ref<number>(0);
</script>